
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="shortcut icon" href="${root}images/favicon.ico">
    <link rel="apple-touch-icon-precomposed" href="${root}images/apple-touch-icon.png">
    <title>心教育</title>
    <link rel="stylesheet" href="${root}css/seedsui.min.css">
    <style>
    .description{
        color: #9e9e9e;
        text-align: center;
        height: 32px;
        line-height: 32px;
    }
    body{
    background-color:white;
    }
    .scroll-wrapper {   
  position: fixed;    
  right: 0;    
  bottom: 0;    
  left: 0;   
  top: 0;   
  -webkit-overflow-scrolling: touch;   
  overflow-y: scroll;   
}   
   
.scroll-wrapper iframe {   
  height: 100%;   
  width: 100%;   
}

    </style>
</head>

<body ontouchstart="">
	
	<!--头部-->
	<header>
	<a class="tab" href="${root}menu" style="float: right;position:absolute;
	border:1px; z-index:9999;clear: both;right: 0px;height: 40px;width: 32px;">
                <i class="icon size24 icon-menudot" style="margin-top: 8px;margin-right: 4px;margin-left: -4px;"></i>
            </a>
        <ul class="tabbar tabbar-line animated " style="margin-right: 32px;">
            <li id="index" class="tab active">
                <label class="tab-label">推荐</label>
            </li>
            <li class="tab" id="article">
                <label class="tab-label">资讯</label>
            </li>
            <li class="tab" id="combo">
                <label class="tab-label">套餐</label>
            </li>
            <!-- <li class="tab">
                <label class="tab-label">培训</label>
            </li>-->
            
            <li class="tab" id="agency">
                <label class="tab-label">机构</label>
            </li>
            <li class="tab" id="teacher">
                <label class="tab-label">讲师</label>
            </li>
            <li class="tab" id="meet">
                <label class="tab-label">会议</label>
            </li>
            <!-- 
            <li class="tab">
                <label class="tab-label">攒课</label>
            </li>
            <li class="tab">
                <label class="tab-label">专题</label>
            </li>
            <li class="tab">
                <label class="tab-label">社区</label>
            </li>
            <li class="tab">
                <label class="tab-label">测评</label>
            </li> -->
            
            
        </ul>
        
        <div class="titlebar">
        <i id="pushLeft" class="icon size24 " style="margin-left: 8px;margin-top:-10px;"><img style="width: 24px;height: 24px;" src="${root}img/logo.png"></i>
            <div class="inputbox bordered" style="margin:0 8px;border-radius: 40px;" data-input="clear">
                <input id="key" style="padding: 2px 8px;" type="search" placeholder="心理直播间" class="search input-text">
                <i id="searchbtn" class="icon size16 icon-search" style="margin-right: 8px;"></i>
            </div>
            <i class="icon size24 icon-fav" style="margin-right: 8px;"></i>
            
            <i class="icon size24 icon-timeend" style="margin-right: 8px;"></i>
        </div>
    </header>
    <article style="margin-top: 44px;padding-bottom: 50px;">
        <!--轮播-->
            
            <div id="article1" ></div>
    </article>
   
		<footer style="position: fixed;left: 0;bottom: 0;">
		<ul class="tabbar tabbar-footer reverse">
            <li class="tab active">
                <i class="icon icon-home-fill"></i>
                <label class="tab-label">首页</label>
            </li>
            <li class="tab" onclick="location.href='${root}course/cate'">
                <i class="icon icon-layer"></i>
                <label class="tab-label">课程</label>
            </li>
            <li class="tab" onclick="location.href='${root}vip/'">
                <img src="${root}img/vip/365.png" style="height: 24px;width: 24px;">
                <label class="tab-label">VIP</label>
            </li>
            <li class="tab" onclick="location.href='${root}zb/'">
                <i class="icon icon-video"></i>
                <label class="tab-label">直播</label>
            </li>
            <li class="tab" onclick="location.href='${root}users/'">
                <i class="icon icon-user"></i>
                <label class="tab-label">我的</label>
            </li>
        </ul>
	</footer>
	<script src="${root}js/seedsui.min.js"></script>
	<script src="${root}js/jquery-2.1.3.js"></script>
    <script>
    //轮播
    window.addEventListener("load",function(e){
    	
    	
        //导航
        [].slice.call(document.querySelectorAll('.tabbar-line')).forEach(function(tabbar){
            tabbar.onclick=function(e){
                [].slice.call(tabbar.querySelectorAll('.tab')).forEach(function(tab) {
                    tab.classList.remove("active");
                });
                e.target.classList.add("active");
            }
        });
    },false);
   
   
	function back(){history.go(-1);}
	$(function(){
		$.ajaxSetup({cache: false });
		
		$("#index").click(function(){//推荐
			//$("#carousel1").css("display","block")
			$("#article1").load("${root}main",{},function(result){
				var s1=new Carrousel("#carousel1",{
	                "pagination":".carrousel-pagination",
	                //autoplay:3000,
	                "loop":true
	            });
				
		  	});
		})
		$("#article").click(function(){
			$(".tabbar-line .tab").removeClass("active");
			$(this).addClass("active");
			$("#article1").load("${root}article/",{},function(result){
		  	});
		})
		$("#combo").click(function(){
			$(".tabbar-line .tab").removeClass("active");
			$(this).addClass("active");
			//$("#carousel2").css("display","none")
			$("#article1").load("${root}combo/list",{},function(result){
				var s1=new Carrousel("#carousel2",{
		            "pagination":".carrousel-pagination",
		            "loop":true
		        });
		  	});
		})
		$("#teacher").click(function(){
			$(".tabbar-line .tab").removeClass("active");
			$(this).addClass("active");
			$("#article1").load("${root}teacher/",{},function(result){
		  	});
		})
		$("#agency").click(function(){
			$(".tabbar-line .tab").removeClass("active");
			$(this).addClass("active");
			$("#article1").load("${root}agency/",{},function(result){
		  	});
		})
		$("#meet").click(function(){
			$(".tabbar-line .tab").removeClass("active");
			$(this).addClass("active");
			$("#article1").load("${root}meet/",{},function(result){
		  	});
		})
		
		
		$("#searchbtn").on('click', function(){
    		location.href='${root}course/?key='+$("#key").val();
        	
    	})
 		$("#key").on('search', function(){
	 		location.href='${root}course/?key='+$(this).val();
    	})
    	<!--:if(!isEmpty(p.meet)){-->
    	$("#meet").click();
    	<!--:}else if(!isEmpty(p.article)){-->
    	$("#article").click();
    	<!--:}else if(!isEmpty(p.combo)){-->
    	$("#combo").click();
    	<!--:}else if(!isEmpty(p.agency)){-->
    	$("#agency").click();
    	<!--:}else if(!isEmpty(p.teacher)){-->
    	$("#teacher").click();
		<!--:}else{-->
		$("#index").click();
		<!--:}-->
	})
	</script>
</body>
</html>
